<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8"/>
<title>Yogette's Toppings Page</title>

        <style type="text/css">
            #sortable1 { list-style-type: none; margin: 0; padding: 0; width: 60%; }
            #sortable1 tr { margin: 0 3px 3px 3px; padding: 0.4em; padding-left: 1.5em; font-size: 1.4em; height: 18px; }
            #sortable1 tr span { position: absolute; margin-left: -1.3em; }
            #sortable2 { list-style-type: none; margin: 0; padding: 0; width: 60%; }
            #sortable2 tr { margin: 0 3px 3px 3px; padding: 0.4em; padding-left: 1.5em; font-size: 1.4em; height: 18px; }
            #sortable2 tr span { position: absolute; margin-left: -1.3em; }
        </style>
        
<link href="<?php echo base_url(); ?>/yogette/css/style.css" rel="stylesheet" type="text/css" />

<link href="<?php echo base_url(); ?>/yogette/css/yogette.css" rel="stylesheet" type="text/css"/>
<link href="<?php echo base_url(); ?>/yogette/css/jquery.lightbox-0.4.css" rel="stylesheet" type="text/css" />
<link href="<?php echo base_url(); ?>/yogette/css/nyroModal.css" rel="stylesheet" type="text/css" />

<script type="text/javascript" src="<?php echo base_url(); ?>/yogette/js/jquery-1.5.2.min.js"></script>
<script type="text/javascript" src="<?php echo base_url(); ?>/yogette/js/jquery-ui-1.8.11.custom.min.js"></script>
<script type="text/javascript" src="<?php echo base_url(); ?>/yogette/js/jquery-1.7.1.js"></script>
<script type="text/javascript" src="<?php echo base_url(); ?>/yogette/js/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="<?php echo base_url(); ?>/yogette/js/jquery-light.js"></script>
<script type="text/javascript" src="<?php echo base_url(); ?>/yogette/js/jquery.lightbox-0.4.js"></script>
<script type="text/javascript" src="<?php echo base_url(); ?>/yogette/js/jquery.nyroModal.custom.js"></script>
<script type="text/javascript" src="<?php echo base_url(); ?>/yogette/js/jquery.nyroModal.custom.min.js"></script>
<script type="text/javascript" src="<?php echo base_url(); ?>/yogette/js/jquery.nyroModal-ie6.js"></script>
<script type="text/javascript" src="<?php echo base_url(); ?>/yogette/js/jquery.nyroModal-ie6.min.js"></script>
   
<script type="text/javascript">
    $(function() {
        $("#sortable1").sortable({
            placeholder: 'ui-state-highlight',        
            stop: function(i) {
                placeholder: 'ui-state-highlight',
                $.ajax({
                    type: "POST",
                    url: "<?=base_url().'member/update_queue'?>",
                    data: $("#sortable1").sortable("serialize")});
            }
        });
        $("#sortable1").disableSelection();
                });
	
        $(function() {
        $("#sortable2").sortable({
            placeholder: 'ui-state-highlight',   
            stop: function(i) {
                placeholder: 'ui-state-highlight',             
                $.ajax({
                    type: "POST",
                    url: "<?=base_url().'member/update_queue'?>",
                    data: $("#sortable2").sortable("serialize")});
            }
        });
        $("#sortable2").disableSelection();
                });
       
        
      
    </script>
     <script>
  
         $(function() {
          $('.nyroModal').nyroModal();
        }); 
        
        $(function() {
          $('.showme2').nyroModal();
        }); 
        $(function() {
          $('.showme3').nyroModal();
        }); 
        
        $(function() {
	// Use this example, or...
	$('a[@rel*=lightbox]').lightBox(); // Select all links that contains lightbox in the attribute rel
	// This, or...
	$('#gallery a').lightBox(); // Select all links in object with gallery ID
	// This, or...
	$('a.lightbox').lightBox(); // Select all links with lightbox class
	// This, or...
	$('a').lightBox(); // Select all links in the page
	// ... The possibility are many. Use your creative or choose one in the examples above
        $('a').lightBox();
        
});     $('#showme').lightBox();
        $('#showme1').lightBox();
        

        $(function() {
	$('.one').lightBox({fixedNavigation:true});
        });

</script>
    </head>

    <body id="blog_entry" class="body-user">
         
        <div class="main-wrapper-blog" style=" height:auto; position:absolute ; " >
            <img class="pinkcircle" src="<?php echo base_url(); ?>yogette/images/pinkCircle.jpg"/>
            <div class="Container"></div>
            <div class="menulist">
                <ul class="menulist-ul">
                    <li><img class="ice-cream" src="<?php echo base_url(); ?>yogette/images/logoIcon.jpg"/><a href="/yogette/member"><img src="<?php echo base_url(); ?>yogette/images/mainboard.jpg" class="home" alt="Yogette's Homepage"/></a></li>
                </ul>
            </div>
            <div style=" margin-left: 70.5%;">
                <?php if (!$this->session->userdata('c_logged_in')) { ?>
                    |-| <a class="metadata-blog-div-a" href="/yogette/user/login">Login-In</a> |-|
                <?php } ?>
                <?php if ($this->session->userdata('c_logged_in')) { ?>
                    |-| <a class="metadata-blog-div-a" href="/yogette/cart">View-Cart</a> |-|
                    |-| <a class="metadata-blog-div-a" href="/yogette/menu/logout">Login-Out</a> |-|
                <?php } ?>
            </div>
            
            <div class="content" style="margin-top: 6em ">
              
               <div class="blog-div-th" style="text-align: center; margin-top: 0em">Yogette's Toppings</div>
            
                        <!-- check if there is movies queue list and print it or not and print the error -->
                        <div class="data" style ="text-align: center; margin: 0em 10em 10em 10em;" >
                            <?php
                            if ($item == false ) {
                                ?> 
                                        <table cellspacing="0" cellpadding="4" border="4">
                                            <thead>
                                                <tr>
                                                <td><h1>Result</h1></td>
                                                </tr>
                                            </thead>
                                            <tbody id="sortable1">
                                                <tr>
                                                <td><h1>We don't have any Toppings</h1></td>
                                                </tr>
                                            </tbody>
                                        </table>
                        </div>
                        <?php } else { ?>
                        <div class="data" style ="text-align: center; margin: 0em 10em 10em 20em;  ">
                            <div class="blog-div-th" style="font-size: medium; text-align: center; margin-left: -10em; margin-top: 0em">choose your topping and add it to your Item</div>
                            <table cellspacing="1" cellpadding="4" border="4">
                                <thead>
                                <tr>
                                <td>Top ID</td>
                                <td>Topping Name</td>
                                <td>Topping Description</td>
                                <td>Topping Price</td>
                                <td>Topping Image</td>
                                </tr>
                                </thead>
                                <tbody id="sortable1">
                                    <?php
                                    foreach ($item as $items) {
                                    $prod_id = $items->top_id;
                                    echo "<tr id='item_$prod_id' class='ui-state-default'>"; ?>
                                        <td><?php echo $items->top_id; ?></td>
                                        <td><?php echo $items->top_name; ?></td>
                                        <td><?php echo $items->top_desc; ?></td>
                                        <td><?php echo $items->top_price; ?></td>
                                        <td><a href="<?php echo base_url(); ?>yogette/images/<?php echo $items->top_pic; ?>"
                                              class="nyroModal" ><img src="<?php echo base_url(); ?>yogette/images/<?php echo $items->top_pic;?>"
                                              class="showme3" width="40" height="40" alt="" id="showme"/></a></td>
                                    <?php echo "</tr>"; } ?>
                                </tbody>
                            </table>
                         </div> 
                           <?php } ?>        
            </div>

        </div>

                      
        <!-- footer start -->
        <div class="pre-footer">   
        </div>
        <div class="footer">
            <div>
                <p class="footer-p1">yogurt is healthy</p>
            </div>
            <div>
                <p class="footer-p2">Copyright &COPY; 2010 YOGETTE.</p>
            </div>
        </div>
        <img class="post-footer" src="<?php echo base_url(); ?>yogette/blank.jpg" id="blank" name="blank" /> 
        <!-- footer ends-->

    </body>
</html>